<template>
        <div class="page" v-if="searchList">
            <ul class="user-list">
                <li class="com-border-bottom" v-for='item in items' @click="gotoCv(item.user_id,item.doumi_user_id)">
                    <a class="touch" href="#">
                        <img class="avatar" v-if="item.logo" :src="item.logo" alt="">
                        <img class="avatar" v-else src="http://sta.doumistatic.com/src/image/saas/avatar.png" alt="">
                        <h2>
                            <span v-if="name_port1(item.real_name)">{{name_port1(item.real_name)}}</span><span v-if="name_port2(item.real_name)" style="color:rgb(255, 187, 0);">{{name_port2(item.real_name)}}</span><span v-if="name_port3(item.real_name)">{{name_port3(item.real_name)}}</span>  
                            <span class="bg_sprite gender female" v-if="item.gender == '女'"></span>
                            <span class="bg_sprite gender male" v-else></span>
                        </h2>
                        <p>
                            <span class="tag">{{item.age}}岁</span>
                            <span class="tag" v-if="item.province == item.city">{{item.province}}{{item.district}}</span>
                            <span class="tag" v-else>{{item.province}}{{item.city}}{{item.district}}</span>
                        </p>
                        <span class="bg_sprite phone" @click.stop="call(item.mobile)"></span>
                    </a>
                </li>
            </ul>  
        </div>
        <div v-show="searching && searchEmpty == 1" class="mod-empty new_mod-empty">
            <!-- <div class="icon icon_4"></div>
            <p class="tip">人才库简历搜索</p>
            <p class="tip" style="color:#ccc;font-size:12px;">可根据姓名、拼音、手机号搜索</p> -->
            <div class="search_tip">你可以搜索</div>
            <div class="searchName">
                <img src="../../static/imgs/icons/icon_8.png" class="searchName_img">
                <p class="searchName_tip">姓名</p>
            </div>
            <div class="line"></div>
            <div class="searchPhone">
                <img src="../../static/imgs/icons/icon_9.png" class="searchPhone_img">
                <p class="searchPhone_tip">手机号</p>
            </div>

        </div>
       <!--  <div v-show="noData && searchEmpty == 1" class="mod-empty new_mod-empty">
            <div class="icon icon_4"></div>
            <p class="tip">未搜索到<span style="color:rgb(255, 187, 0);">{{searchKey}}</span>相关人员</p>
            <p class="tip">什么都没有搜到耶</p>
        </div> -->
        <div class="page empty-page" v-show="noData && searchEmpty == 1">
            <div class="mod-empty new_mod-empty3">
                <div class="icon icon_4"></div>
                <!-- <p class="tip">未搜索到<span style="color:rgb(255, 187, 0);">{{searchKey}}</span>相关人员</p> -->
                <p class="tip">什么都没有搜到耶</p>
            </div>
        </div>
        <div class="page__bd" v-show="showMore">
          <div class="weui-loadmore">
              <i class="weui-loading"></i>
              <span class="weui-loadmore__tips">正在加载</span>
          </div>
        </div>
        <div v-show="searchEmpty == 0" class="mod-empty">
            <div class="icon icon_4"></div>
            <p class="tip">暂无加入企业，无法使用人才库搜索</p>
        </div>
    
</template>


<script>
    /**
     *  引入工具类库 或 Native API
     *  example : import widget from 'gapi/widget'
     */
    import searchPage from 'clientApi/searchPage' 
    import widget from 'gapi/widget.js'
    import * as util from 'js/util.js'
    import commonPage from 'clientApi/commonPage.js'
    import clientUi from 'gapi/clientUi.js'
    /**
     *  引入组件 以及 组件接口(Action)
     *  example : import Somecomponents from 'components/Somecomponents/Somecomponents'
     */
    let teamid = ''
    let offset = 1 // 返回记录行的偏移量(从第几条数据开始取
    let rows = 20 // 返回记录行的最大条数（取的条数）
    let canLoadMore = 1

    /**
     *  组件实例对象
     */
    export default {
        components: {

        },
        data: function(){
            return{
                showMore:false,
                items: [],
                status: '',
                searchKey : '',
                loading: false,
                searching: true,
                searchList:false,
                noData : false,
                searchEmpty:''
            }
        },
        vuex: {
            getters: {

            },
            actions: {

            }
        },
        methods: {
            /**
             * 初始化
             * @method init
             * @public
             * @return {Null} void
             */
            init (){
                const setKeywords = (data) => {
                    this.searchKey = data.keyword
                    offset = 1
                    if(!this.showMore){
                      commonPage.loadPageStatus('loading')
                    }
                    util.ajax({
                        url:'/talent/member/search',
                        type:'POST',
                        data:{
                            team_id:teamid,
                            project_id:0,
                            search_str:data.keyword,
                            offset:offset,
                            rows:rows
                        },
                        timeout:10000,
                        success:(obj) => { 
                            console.log(JSON.stringify(obj))
                            if(!this.showMore){
                                commonPage.loadPageStatus('loadSuccess')
                            }else{
                                this.showMore = false
                            }
                            if(obj&&obj.errno == 0){
                                if(obj.data.length){
                                    this.items = obj.data
                                    this.noData = false;
                                    this.searching = false
                                    this.searchList = true
                                    offset+=rows
                                }else{
                                    this.noData = true;
                                    this.searchList = false;
                                    this.searching = false
                                    this.items = ['']
                                    canLoadMore = 0
                                }
                            }else{
                                widget.toast(obj.errmsg)
                            }
                        },
                        error: (xhr, status) => {
                            commonPage.loadPageStatus('loadSuccess')
                            widget.toast('服务器异常')
                        },
                        noNetwork: () => {
                            commonPage.loadPageStatus('loadSuccess')
                            widget.toast('网络连接失败，请检查网络')
                        }
                    })
                }
                if(this.searchEmpty == 1){
                    window.setKeywords = setKeywords
                }
               
            },
            /*跳转到简历*/
            gotoCv (userId,doumiUserId){
                let encodeStr = encodeURIComponent(`doumiUserId=${doumiUserId}&userId=${userId}`)
                location.href = `dmsaas://TalentDetail?urdData=${encodeStr}`
            },
            name_port1(real_name){
                let port1 = ''
                if(real_name.indexOf(this.searchKey) > -1){
                    port1 = real_name.substr(0,real_name.indexOf(this.searchKey))
                }else{
                    port1 = real_name
                }
                return port1
            },
            name_port2(real_name){
                let port2 = ''
                if(real_name.indexOf(this.searchKey) > -1){
                    port2 = real_name.substr(real_name.indexOf(this.searchKey), this.searchKey.length)
                }
                return port2
            },
            name_port3(real_name){
                let port3 = ''
                if(real_name.indexOf(this.searchKey) > -1){
                    port3 = real_name.substr(real_name.indexOf(this.searchKey)+this.searchKey.length)
                }
                return port3
            },
            /*拨打电话*/
            call (mobile){
                const title = '拨打电话';
                const message = mobile;
                const okBtn = '确定';
                const cancelBtn = '取消';
                const imageName = 'meiyou';
                clientUi.showPhoneDialog(title, message, okBtn, cancelBtn, imageName, () => {
                    
                })
            }
        },
        created(){
            teamid = util.getUrddataString('teamId')
            this.searchEmpty = util.getUrddataString('searchEmpty')
            this.init();
            commonPage.registerHitPageBottomListener(() => {
                if(canLoadMore==0){
                    return
                }
                this.showMore = true
                window.setKeywords = setKeywords
            }, 0)
        }
    }


</script>

<!-- CSS 样式 -->
<style src="../../node_modules/weui/dist/style/weui.css"></style>
<style src="../../static/css/common.css"></style>
<style src="../../static/css/talent-pool.css"></style>
<style>
    .female{
        display: inline-block;
        width: 12px;
        height: 12px;
        margin-left: 6px;
        background-position: -17px -109px;
    }
    .male{
        display: inline-block;
        width: 12px;
        height: 12px;
        margin-left: 6px;
        background-position: 0px -109px;
    }
    .phone{
        display: inherit;
        width: 18px;
        height: 18px;
        background-position: 0px -43px;
        position: absolute;
        right: 20px;
        bottom: 31px;
        background-size: 250px auto;
    }
</style>
